<template>
    <div>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">优惠券类型<span>*</span></td>
                    <td>
                        <select v-model="data.DiscountT">
                            <option value="">请选择</option>
                            <option :value="1">代金券</option>
                            <option :value="2">折扣券</option>
                            <option :value="3">兑换券</option>
                        </select>
                    </td>
                </tr>

                <tr>
                    <td align="right">优惠券标题</td>
                    <td>
                        <input type="text" v-model="data.Title">
                    </td>
                </tr>

                <tr>
                    <td align="right">副标题</td>
                    <td>
                        <input type="text" v-model="data.subTitle">
                    </td>
                </tr>

                <tr>
                    <td align="right">图片</td>
                    <td>
                        <input type="file" @change="upimg">
                        <img :src="data.Photo" width="150" height="100" >
                    </td>
                </tr>


                <tr>
                    <td align="right">库存</td>
                    <td>
                        <input type="text" v-model="data.Count">
                    </td>
                </tr>

                <tr>
                    <td align="right">每人限领数量</td>
                    <td>
                        <input type="text" v-model="data.Number" disabled>
                    </td>
                </tr>

                <tr>
                    <td align="right">使用条件</td>
                    <td>
                        <input type="text" v-model="data.AmountMoney">
                    </td>
                </tr>

                <tr v-if="data.DiscountT==1">
                    <td align="right">减免金额</td>
                    <td>
                        <input type="text" v-model="data.SubMoney">
                    </td>
                </tr>


                <tr v-if="data.DiscountT==2">
                    <td align="right">折扣价</td>
                    <td>
                        <input type="text" v-model="data.ZheKou"> 
                    </td>
                </tr>

                <tr>
                    <td align="right">有效期</td>
                    <td>
                        <input type="date" v-model="data.BeginTime">-<input type="date" v-model="data.EndTime">
                    </td>
                </tr>

                

                <tr>
                    <td align="right">适用业务</td>
                    <td>
                        <input type="checkbox" name="UseService" value="订房" v-model="data.UseService">订房
                        <input type="checkbox" name="UseService" value="商城" v-model="data.UseService">商城
                        <input type="checkbox" name="UseService" value="食堂" v-model="data.UseService">食堂
                        <input type="checkbox" name="UseService" value="收款码" v-model="data.UseService">收款码
                    </td>
                </tr>

                <tr>
                    <td align="right">使用须知</td>
                    <td>
                        <textarea cols="30" rows="5" v-model="data.UseDecs"></textarea>
                    </td>
                </tr>

                <tr>
                    <td align="right">适用门店</td>
                    <td>
                        <select v-model="data.ShopId">
                            <option value="">请选择</option>
                            <option :value="item.Id" v-for="item in data1.list">{{item.ShopName  }}</option>
                        </select>
                    </td>
                </tr>

                <tr>
                    <td align="right">服务电话</td>
                    <td>
                        <input type="text" v-model="data.Phone">
                    </td>
                </tr>

                <tr>
                    <td align="right">优惠券颜色</td>
                    <td>
                        <input type="color" v-model="data.Color">
                    </td>
                </tr>

                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="添加" class="btn btn-primary" @click="adddis">
                    </td>
                </tr>

            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">

import { ref, reactive, onMounted, useSlots } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import moment from 'moment';
import axios from 'axios';
const route = useRoute();
const router = useRouter();


import{UseUserStore}from '../../stores/user'
const UserStore=UseUserStore();

onMounted(() => {

    getList();
})

let data:any=reactive({
  "DiscountT": "",
  "Title": "",
  "subTitle": "",
  "Photo": "",
  "Count": "",
  "Number": 1,
  "AmountMoney": "",
  "SubMoney": 0,
  "ZheKou": 10,
  "BeginTime": "",
  "EndTime": "",
  "UseService": [],
  "UseDecs": "",
  "ShopId": "",
  "Phone": "",
  "Color": "#ff0000",
})
//上传图片
const upimg = (e: any) => {
    console.log(e)
    let m=e.target.files[0];
    let p=new FormData();
    p.append('file',m)
    axios({
        method:"post",
        url:"/api/DisUpfile",
        data:p
    })
    .then(res=>{
        data.Photo=res.data
        if(res.data>0){
            alert('上传成功');
        }
        else if(res.data=="不是图片"){
            alert('不是图片')
        }
        else if(res.data=="大于2MB"){
            alert('大于2MB');
        }
    })
    .catch(err=>{
        console.log(err);
    })
}

//添加优惠券
const adddis = () => {
    data.UseService=data.UseService.toString();

    if(data.DiscountT==""){
        alert('不能为空')
        return;
    }
    if(data.Title==""){
        alert('优惠券标题不能为空')
        return;
    }
    if(data.subTitle==""){
        alert('优惠券副标题不能为空')
        return;
    }
    if(data.Photo==""){
        alert('优惠券图片不能为空')
        return;
    }
    
    if(data.Count==""){
        alert('优惠券库存不能为空')
        return;
    }
    let cou=/^[1-9]\d*$/   //只能是正整数
    if(isNaN(data.Count))
    {
        alert('库存只能是数值类型')
        return;
    }
    if(parseInt(data.Count)<0){
        alert('优惠券库存只能是大于0的整数')
        return;
    }
    if(data.SubMoney==""&&data.DiscountT==1){
        alert('减免金额不能为空')
        return;
    }

    if(!cou.test(data.SubMoney)&&data.DiscountT==1){
        alert('减免金额只能是大于0的整数')
        return;
    }
    if(data.ZheKou==""&&data.DiscountT==2){
        alert('折扣不能为空')
        return;
    }


    if(data.AmountMoney==""){
        alert('使用条件不能为空');
        return;
    }
    if(data.BeginTime==""){
        alert('开始时间不能为空');
        return;
    }
    if(data.EndTime==""){
        alert('结束时间不能为空');
        return;
    }
    if(data.UseService.length==""){
        alert('使用业务必选');
        return;
    }
    if(data.UseDecs==""){
        alert('使用须知不能为空');
        return;
    }
    if(data.ShopId==""){
        alert('使用门店不能为空');
        return;
    }
    if(data.Phone==""){
        alert('电话号码不能为空');
        return;
    }
    let phones=/^1[3-9]\d{9}$/
    if(!phones.test(data.Phone))
    {
        alert('手机号格式不正确');
        return;
    }

    axios({
        method:"post",
        url:"/api/Disc/DiscountAdd",
        data:data
    })
    .then(res=>{
        console.log(res);
        if(res.data==-1){
            alert('重复')
        }
        else if(res.data>0){
            
            alert('添加成功');
            router.push('/discountlist')
        }
        else{
            alert('添加失败');
        }
    })
    .catch(err=>{
        console.log(err);
    })
}


//存储门店
let data1: any = reactive({
    list: [],
    totalCount: "",
    totalPage: ""
})
//获取门店列表参数
let querinfo = reactive({
    pageIndex: 1,
    pageSize: 100,
    shopName: "",
    date1: ""
})
const getList = () => {
    axios({
        method: "get",
        url: "/api/Shops/GetShopList",
        params: querinfo,
    })
        .then(res => {
            data1.list = res.data.list;
            data1.totalCount = res.data.totalCount;
            data1.totalPage = res.data.totalPage;
        })
        .catch(err => {
            console.log(err)
        })
}





</script>





<style scoped>
span{
    color: red;
}
</style>